﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <style type="text/css">
* {margin: 0;padding: 0;}
body {margin: 0;padding: 0;font: 12px "Microsoft YaHei";}

.box {height: 100px; width: 1200px; float: left; overflow: hidden;position:relative;background:url('Images/toolImg/scrollBG.png');}
.box .box_left{height: 100%; width: 45px; float: left; position:absolute;top:0px;left:0px;z-index:10;}
.box .box_left .box_left_btn{height: 20px; width: 10px; float: left; margin-top: 40px; background-image: url('Images/toolImg/arrowL.png'); cursor: pointer; margin-left: 18px;}
.box .box_right{height: 100%; width: 45px; float: left; position:absolute;top:0px;left:1155px; z-index:10;}
.box .box_right .box_right_btn{height: 20px; width: 10px; float: left; margin-top: 40px; background-image: url('Images/toolImg/arrowR.png'); cursor: pointer; margin-left: 18px;}

#wxlboxs {height: 100%; float: left; z-index:2;}
#wxlboxs .wxlbox {height: 70px;width: 108px;float: left;margin: 15px 0 0 2px;border-left: 1px solid #90AFC8;cursor: pointer;}
#wxlboxs .wxlbox .wxlboxTitle{height: 30px;line-height: 30px;font-size: 16px;font-family: 微软雅黑;width: 100px;margin-left: 6px;float: left;text-align: left;color: red;overflow: hidden;}
#wxlboxs .wxlbox .wxlboxTitle:hover {text-decoration: underline;}
#wxlboxs .wxlbox .wxlboxinfoDiv {height: 20px;width: 100px;float: left;margin-left: 6px;font-family: 微软雅黑;color: White;font-size: 14px;}
    </style>
       <script src="http://hsjdtech.com/inter/scripts/jquery-3.3.1.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        var _scrollNum = 0;
        function scrollInfo(t) {
            var scrolldivWidth = $("#wxlboxs .wxlbox").length * 108;
            if (t == "l") {
                if (_scrollNum + 1110 > 0) {return;}
                else {
                    _scrollNum += 1110;
                    $("#wxlboxs").animate({ marginLeft: _scrollNum + "px" }, 1200);
                }
            }
            if (t == "r") {
                if (_scrollNum - 1110 <= parseInt("-" + scrolldivWidth)) {return;}
                else {
                    _scrollNum -= 1110;
                    $("#wxlboxs").animate({ marginLeft: _scrollNum + "px" }, 1200);
                }
            }

        }
    </script>
</head>
<body>
    <div class="box">

        <div class="box_left"><div onclick="scrollInfo('l')" class="box_left_btn"></div></div>

        <div style="height: 100px; width: 1110px; float: left; position:absolute;top:0px;left:45px;">
             <div id="wxlboxs">
                <div class="wxlbox">
                    <div id="Div0" class="wxlboxTitle" onclick="toEveryUrl('山西')">山西1</div>
                    <div class="wxlboxinfoDiv">无侵染:7</div>
                    <div class="wxlboxinfoDiv">三代以上:0</div>
                </div>
                <div class="wxlbox">
                    <div id="Div1" class="wxlboxTitle" onclick="toEveryUrl('山西')">山西2</div>
                    <div class="wxlboxinfoDiv">无侵染:7</div>
                    <div class="wxlboxinfoDiv">三代以上:0</div>
                </div>
                <div class="wxlbox">
                    <div id="Div2" class="wxlboxTitle" onclick="toEveryUrl('山西')">山西3</div>
                    <div class="wxlboxinfoDiv">无侵染:7</div>
                    <div class="wxlboxinfoDiv">三代以上:0</div>
                </div>
                <div class="wxlbox">
                    <div id="Div3" class="wxlboxTitle" onclick="toEveryUrl('山西')">山西4</div>
                    <div class="wxlboxinfoDiv">无侵染:7</div>
                    <div class="wxlboxinfoDiv">三代以上:0</div>
                </div>
                <div class="wxlbox">
                    <div id="Div4" class="wxlboxTitle" onclick="toEveryUrl('山西')">山西5</div>
                    <div class="wxlboxinfoDiv">无侵染:7</div>
                    <div class="wxlboxinfoDiv">三代以上:0</div>
                </div>
                <div class="wxlbox">
                    <div id="Div5" class="wxlboxTitle" onclick="toEveryUrl('山西')">山西6</div>
                    <div class="wxlboxinfoDiv">无侵染:7</div>
                    <div class="wxlboxinfoDiv">三代以上:0</div>
                </div>
                <div class="wxlbox">
                    <div id="Div6" class="wxlboxTitle" onclick="toEveryUrl('山西')">山西7</div>
                    <div class="wxlboxinfoDiv">无侵染:7</div>
                    <div class="wxlboxinfoDiv">三代以上:0</div>
                </div>
                <div class="wxlbox">
                    <div id="Div7" class="wxlboxTitle" onclick="toEveryUrl('山西')">山西8</div>
                    <div class="wxlboxinfoDiv">无侵染:7</div>
                    <div class="wxlboxinfoDiv">三代以上:0</div>
                </div>
                <div class="wxlbox">
                    <div id="Div8" class="wxlboxTitle" onclick="toEveryUrl('山西')">山西9</div>
                    <div class="wxlboxinfoDiv">无侵染:7</div>
                    <div class="wxlboxinfoDiv">三代以上:0</div>
                </div>
                <div class="wxlbox">
                    <div id="Div9" class="wxlboxTitle" onclick="toEveryUrl('山西')">山西10</div>
                    <div class="wxlboxinfoDiv">无侵染:7</div>
                    <div class="wxlboxinfoDiv">三代以上:0</div>
                </div>
                <div class="wxlbox">
                    <div id="Div10" class="wxlboxTitle" onclick="toEveryUrl('山西')">山西11</div>
                    <div class="wxlboxinfoDiv">无侵染:7</div>
                    <div class="wxlboxinfoDiv">三代以上:0</div>
                </div>
                <div class="wxlbox">
                    <div id="Div11" class="wxlboxTitle" onclick="toEveryUrl('山西')">山西12</div>
                    <div class="wxlboxinfoDiv">无侵染:7</div>
                    <div class="wxlboxinfoDiv">三代以上:0</div>
                </div>
                <div class="wxlbox">
                    <div id="Div12" class="wxlboxTitle" onclick="toEveryUrl('山西')">山西13</div>
                    <div class="wxlboxinfoDiv">无侵染:7</div>
                    <div class="wxlboxinfoDiv">三代以上:0</div>
                </div>
                <div class="wxlbox">
                    <div id="Div13" class="wxlboxTitle" onclick="toEveryUrl('山西')">山西14</div>
                    <div class="wxlboxinfoDiv">无侵染:7</div>
                    <div class="wxlboxinfoDiv">三代以上:0</div>
                </div>
              </div>
        </div>

        <div class="box_right"><div onclick="scrollInfo('r')" class="box_right_btn"></div></div>

    </div>
</body>
</html>
